/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
    InputLine, TextArea, Text, BlobInputList, Button, useToast, Input, LineColumn, SuffixInput
} from "customize-easy-ui-component";
import {
    InspectRecordLayout, InternalItemProps, useInputControlSure, useItemInputControl
} from "../../common/base";
import {EditStorageContext} from "../../StorageContext";
import {useMeasureInpFilter} from "../../common/hooks";
import {useMedia} from "use-media";
import {assertNamesUnique} from "../../common/eHelper";

// const 示图说明选: string[] | undefined=['vcboCb' ];
const itemA测点位置=['检测结果','单内编','备注','保压时','泄漏','异常现','开始时','结束时'];
//只能上不变的：不然hook死循环
const defaultValCb= (par: any)=>{
    const { 检测结果 }=par||{};
    if(!检测结果)   par.检测结果='所检项目未见异常，检测结果为1级。';
    if(!par.泄漏)   par.泄漏='无';
    if(!par.异常现)   par.异常现='无';
    return  par;
}
export const ResultDiagram=
  React.forwardRef((
    { children, show ,alone=true,redId,nestMd, repId}:InternalItemProps,  ref
  ) => {
      const [getInpFilter] = useMeasureInpFilter(null, itemA测点位置, defaultValCb);
      const {inp, setInp,} = useInputControlSure({ ref,redId,nestMd });
    return (
      <InspectRecordLayout inp={inp} setInp={setInp}  getInpFilter={getInpFilter} show={show} redId={redId} nestMd={nestMd}
                           alone={alone}  label={'气密性试验结果-测点位置示意图'}>
          <LineColumn>
              <InputLine label='单位内编号：'>
                  <BlobInputList value={inp?.单内编 || ''} rows={1} datalist={['见特性表']}
                                 onListChange={v => setInp({...inp, 单内编: v || undefined}) } />
              </InputLine>
              <InputLine  label='试验压力保压时长:' >
                  <SuffixInput placeholder="保压时长" value={ inp?.保压时 || ''}
                               onSave={txt => setInp({ ...inp, 保压时: txt||undefined} ) }
                  >min</SuffixInput>
              </InputLine>
              <InputLine  label='检查容器及连接部位泄漏吗？' >
                  <Input  value={inp?.泄漏 ||''}
                          onChange={e => setInp({ ...inp, 泄漏: e.currentTarget.value||undefined}) } />
              </InputLine>
              <InputLine  label='检查容器及连接部位异常现象：' >
                  <Input  value={inp?.异常现 ||''}
                          onChange={e => setInp({ ...inp, 异常现: e.currentTarget.value||undefined}) } />
              </InputLine>
              <InputLine  label='试验开始时间' >
                  <Input  value={inp?.开始时 ||''}  type='time'
                          onChange={e => setInp({ ...inp, 开始时: e.currentTarget.value||undefined}) } />
              </InputLine>
              <InputLine  label='试验结束时间' >
                  <Input  value={inp?.结束时 ||''}  type='time'
                          onChange={e => setInp({ ...inp, 结束时: e.currentTarget.value||undefined}) } />
              </InputLine>
          </LineColumn>
          备注:
          <TextArea  value={inp?.备注 ||''} rows={5}
                     onChange={e => setInp({ ...inp, 备注: e.currentTarget.value||undefined}) } />
          检测结果:
          <BlobInputList value={inp?.检测结果 || ''} rows={5} datalist={["合格。","符合要求。"]}
                         onListChange={v => setInp({...inp, 检测结果: v || undefined}) } />
        {children}
      </InspectRecordLayout>
    );
} );

// const render试材质={
//     view:(orc:any, parentOrc:any)=>{
//         return <Text css={{fontSize:'0.8rem'}}>试样材质/标准</Text>
//     },
//     text: '试样材质/标准',
// };
const 试验介质选=['氮气','空气'];
export const config测量仪 = [
    [['设备名称', '_$设备名称'],  ['设计压力', {n:'设计压',u:'MPa'}] ],
    [['最高工作压力',{n:'高工压',u:'MPa'}],  ['耐压试验压力',{n:'耐试压',u:'MPa'}], ['气密试验压力',{n:'密试压',u:'MPa'}] ],
    [['试验介质',{n:'试介质',t:'l',l:试验介质选}], ['介质温度', {n:'介质温',u:'℃'}], ['环境温度', {n:'环境温',u:'℃'}] ],
    [['容积', {n:'容积',u:'m3'}], ['安全阀型号','阀型号'], ['试验部位', '试部位'] ],
    [['压力表编号','力表号'],  ['压力表量程',{n:'力表程',u:'MPa'}], ['压力表精度',{n:'力表精',u:'级'}] ],
    [['气密试验设备','试设备'], ['气密试验设备编号', '试设备号'],['试验日期', {n:'试验日',t:'d'}] ],
];

/**【开发测试用的】
 * 【表格工具】 可重复分项情况 JSON.parse(parentOrc?._tblFixed??'[]')   【调整宽度】  直接替换目标表的fixed字段 ：开发测试的
 * */
export const EntranceSetup =
    React.forwardRef((
        {children, show, alone = true, repId, verId, rep}: InternalItemProps, ref
    ) => {
        const atPrint = useMedia('print');
        const toast = useToast();
        const doCheckNames = React.useCallback((verId: string) => {
            //【承压更少项目】，那些属于公共模板目录的 分项报告的唯一性检查在对方自己检查看。
            const result = assertNamesUnique([{value: rep?.tzFields},
                {value: config测量仪, type:'esnt'},
                {value:[...itemA测点位置, ]},
            ]);
            toast({title: "完成！", subtitle: result ? "没发现冲突" : "测试开关没开", intent: "success"});
        }, [rep,toast]);
        const {storage, setStorage} =React.useContext(EditStorageContext) as any;
        const getInpFilter = React.useCallback((par: any) => {
            const {_tblFixed, } =par||{};
            return {_tblFixed, };
        }, []);
        const {inp, setInp} = useItemInputControl({ref});
        if (atPrint) return null;
        else return (
            <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show}
                                 alone={alone} label={'初始化本报告，默认值配置等'}>
                {process.env.REACT_APP_TEST==='true' && <><div>
                    <Text variant="h5">构建开发模板时的工具：校验模板的存储name冲突；</Text>
                    <Button intent='primary' onPress={() => doCheckNames(verId!)}>校验模板name唯一性</Button>
                    <Text variant="h5">设置待测试表格的各列宽度：</Text>
                    <TextArea value={storage?._tblFixed || ''} rows={2} onChange={e =>{
                        JSON.parse(e.currentTarget.value??'[]');
                        setStorage({ ...storage, _tblFixed: e.currentTarget.value || undefined}); }}/>
                </div>
                </>
                }
                <hr/>
            </InspectRecordLayout>
        );
    });

